
<script type="text/javascript">

    
    settings = {
        baseUrl : '<?php echo $this->webroot;?>',
        debug : false,
        formQuestion : "",
        formChoice : "",
        listPollsContainer : "#listPollContainer",
        pollQuestionContainer : "#pollQuestionContainer"
    };
    
    currentSelection = {
        titlePoll : '',
        titleQuestion : ''
    };
    
    actionPollsChoice = {
        name : '',
        questions_id : null        
    };
    
    actionPollsQuestion = {
        name : '',
        action_polls_id : null
    };
        
    $(document).ready(function(){
        $("#pollQuestionChoice").hide();
        $("#pollQuestion").hide();
        
        $('li.poll').next().hide();
        
        /**
         * Cliquer sur un titre de sondage
         */
        $('li.poll').live('click',function(){
            if ($(this).next().is(':visible')){
                $(this).removeClass("current");
                $(this).next().hide('slow');
                $(settings.pollQuestionContainer).css({width: "0%"});
                $(settings.pollQuestionContainer).hide();
                $(settings.listPollsContainer).css({width: "100%"});
            }            
             // Clique pour editer un sondage
            else{
                $('li.poll').removeClass('current');
                $('li.poll').next().hide('slow');
                $('li.question').removeClass('current');
                $("#pollQuestionChoice").hide("slow");
                
                
                $("#pollQuestion").show("slow");
                $(this).addClass("current");
                $(this).next().show('slow');
                
                


                $(settings.pollQuestionContainer).show();
                $(settings.pollQuestionContainer).css({width: "50%"});
                $(settings.listPollsContainer).css({width: "50%"});
                
                actionPollsQuestion.action_polls_id = getId($(this).attr('id'));
                currentSelection.titlePoll = $(this).text();

                $("#pollTitle").text( currentSelection.titlePoll);
            }
        });
        
        /**
         * Suppression d'une question
         */
        $("#delQuestion").click(function(){
            $.ajax({ 
               url: settings.baseUrl + "ActionPollsQuestions/delQuestion/" + actionPollsChoice.questions_id, 
               success: function(){                   
                    $("#pollQuestionChoice").hide("slow");
                    $("#pollQuestion").show("slow");
                    $("#question-"+actionPollsChoice.questions_id).remove();
               },
               error : function(er1, er2){
                   alert(er2);
               },
               type: 'GET'
            });
        });
        
        /**
         * Clique sur une question d'un sondage
         */
        $('li.question').live('click',function(){
            if ($(this).hasClass('current')){
                 
             
            }
            else{
                $('#pollQuestionChoice .choices').html('');
                $('li.question').removeClass('current');
                $(this).addClass("current");
                $("#pollQuestionChoice").show();                
                $("#pollQuestion").hide();

                actionPollsChoice.questions_id = getId($(this).attr('id'));
                currentSelection.nameQuestion = $(this).text();

                $("#pollQuestionChoice .info").text('Question : ' + currentSelection.nameQuestion);
                
                // Récupérations des choix du sondage
                
                $('#ajaxLoader').show();
                $.ajax({
                   url: settings.baseUrl + "ActionPollsChoices/getChoices/" + actionPollsChoice.questions_id, 
                   success: function(data){
                       $('#pollQuestionChoice .choices').html(data);
                        $('#ajaxLoader').hide();
                   },
                   error : function(er1, er2){
                       alert(er2);
                   },
                   type: 'GET'
                });
            
            }
        });
        
        /**
         * Envoi du formulaire d'ajout d'une question
         */
        
        $('#formPollQuestion').submit(function(){
            actionPollsQuestion.name = $('.name',$(this)).val();
            displayInfo();
            
            $.ajax({
               url: settings.baseUrl + "ActionPollsQuestions/addQuestion", 
               success: function(data){
                   idQuestion = parseInt(data);
                   addQuestion(idQuestion);
                   $('#formPollQuestion .name').val('');
               },
               error : function(er1, er2){
                   alert(er2);
               },
               type: 'POST', 
               data : actionPollsQuestion
            });
            
            return false;
        });
        
        /**
         * Envoi du formulaire d'ajout d'un choix a une question
         */        
        $('#formPollQuestionChoice').submit(function(){
            actionPollsChoice.name = $('.name',$(this)).val();
            displayInfo();            
            $.ajax({
               url: settings.baseUrl + "ActionPollsChoices/addChoice", 
               success: function(data){
                   idChoice= parseInt(data);
                   addQuestionChoice(idChoice);
                   $('#formPollQuestionChoice .name').val('');
               },
               error : function(er1, er2){
                   alert(er2);
               },
               type: 'POST', 
               data : actionPollsChoice
            });
            
            return false;
        });
    });
    
    function displayInfo(){
        if (settings.debug){
            alert("Action polls id : " + actionPollsQuestion.action_polls_id + ", name : " + actionPollsQuestion.name + "\n Action polls question id : " + actionPollsChoice.questions_id + ", name : " + actionPollsChoice.name);
        }
    }
    
    function getId(val){
        var data = val.split('-');
        return parseInt(data[1]);
    }
    
    function addQuestion(id){
        $("#poll-"+actionPollsQuestion.action_polls_id).next().append('<li class="question" id="question-'+ id +'">'+ actionPollsQuestion.name +'</li> <ul></ul> ');
    }
    
    function addQuestionChoice(id){
        //$("#question-"+actionPollsChoice.questions_id).next().append('<li class="choice" id="choice-'+ id +'">'+ actionPollsChoice.name +'</li> ');
        
        if ($("#pollQuestionChoice .choices ol > li").html() == null){
            $("#pollQuestionChoice .choices ol").html(' ');
        }
        $("#pollQuestionChoice .choices ol").append('<li class="choice" id="choice-'+ id +'">'+ actionPollsChoice.name +'</li> ');
    }
    
    
    
</script>

<style>
    form{
        overflow: hidden;
        margin : 0px;
    }
    form .input{
        padding : 0%;
        width : 68%;
        float : left;
        clear : none;
        margin : 1%;
    }
    form .submit{
        float : right;
        width : 28%;
        clear : none;
        padding:0px;
        margin : 1%;
        
    }
    
    form div.submit{
        clear:none;
        margin-top : 30px;
    }
    
    
    #listPollContainer{
        width : 100%;
        float : left;
    }
    
    #pollQuestionContainer{
        width : 0%;
        float : right;
        overflow : hidden;
    }
    
    #ajaxLoader{
    }
    
    #delQuestion:hover{
        cursor : pointer;
        color : red;
    }
</style>


<h2>Edition des sondages du groupe</h2>

<div id="listPollContainer">
    <h3> Editer un sondage </h3>
    
    <ul class="listClickable">
    <?php
    if (!empty($dataPoll)){
        
        foreach ($dataPoll as $d){
            $actionPoll = $d['ActionPoll'];
            $questions = $d['ActionPollsQuestion'];
            echo '<li class="poll" id="poll-'.$actionPoll['actions_id'].'">'.$actionPoll['title'].'</li>';
            echo '<ul>';
            foreach ($questions as $question){
                echo '<li class="question" id="question-'.$question['id'].'">  '.$question['name'].'</li> ';
            }
            echo '</ul>';
        }
    }
    ?>
    </ul>
</div>
    
<div id="pollQuestionContainer"> 
    <h3> <span id="pollTitle" class="info"> </span></h3>
    
    <div id="pollQuestion">
        
    <?php
        echo $this->Form->create('ActionPollsQuestion', array(
            'id' => 'formPollQuestion'
        ));
        echo $this->Form->input('Question.name', array(
            'label' => 'Ajouter une question : ',
            'class' => 'name'
        ));
        echo $this->Form->submit('Ajouter');
        echo $this->Form->end();   
    ?>
    </div>
    
    
    <div id="pollQuestionChoice">
        
        

        <h4> <span class="info"> </span> </h4>
        
            <h5 style="padding:2px 0px 10px  0px ;">
                <span id="delQuestion"> Supprimer cette question </span>
            </h5>
        <h5> Les choix de réponse </h5>
        <p>
            <div id="ajaxLoader">
                <?php echo $this->Html->image('ajax-loading.gif');?>
            </div>
        
            <div class="choices">
                
            </div>
        
            <?php
            echo $this->Form->create('ActionPollsChoice', array(
                'id' => 'formPollQuestionChoice'
            ));
            ?>
            <fieldset>
                <?php
                echo $this->Form->input('Question.name', array(
                    'label' => 'Ajouter une réponse ',
                    'class' => 'name'
                ));
                echo $this->Form->submit('Ajouter');
                ?>
           </fieldset> 
            <?php
            echo $this->Form->end();   
            ?>
        </p>
        
    <!--
            <p style="text-align:center;">
                <?php //echo $this->Html->link('Supprimer tout les choix de réponses', array());?>
            </p>
    -->
    </div>
    <!--
    <div id="help">
        <h3>Aide !</h3>
        <p>
            Sélectionnez un sondage à éditer.<br/>
            Ajoutez ensuite des questions au sondage.<br/> 
            Vous pourrez enfin ajouter des choix de réponse en les sélectionnant grâce au menu.
        </p>
    </div>
    -->
</div>